<template>
	<view class="box">
		<view class="envelopeWrap">
			<view class="packet">
				<view class="packetLeft">
					<text>4月8日邀请张三收益</text>
					<text>4月8日 12:12</text>
				</view>

				<view class="packetRight">
					<text>+10.00</text>
				</view>
			</view>

			<view class="packet">
				<view class="packetLeft">
					<text>4月8日邀请张三收益</text>
					<text>4月8日 12:12</text>
				</view>

				<view class="packetRight">
					<text>+10.00</text>
				</view>
			</view>

			<view class="packet">
				<view class="packetLeft">
					<text>4月8日邀请张三收益</text>
					<text>4月8日 12:12</text>
				</view>

				<view class="packetRight">
					<text>+10.00</text>
				</view>
			</view>

			<text class="loading-text">
				{{loadingType === 0&&totalNo>10 ? contentText.contentdown : (loadingType === 1&&totalNo>10 ? contentText.contentrefresh : contentText.contentnomore)}}
			</text>
		</view>


	</view>
</template>

<script>
	import api from '../../api/index.js';
	export default {
		data() {
			return {
				pageNo: 1, //页数
				pageSize: 10, //条数
				totalNo:9,//总条数
				redEvlopelist: [], //明细列表
				loadingType: 0,
				contentText: {
					contentdown: "上拉显示更多",
					contentrefresh: "正在加载...",
					contentnomore: "没有更多数据了"
				}
			}
		},
		Onload() {
			this.getredEnvelope()
		},
		methods: {
			// 下拉刷新
			onPullDownRefresh() {
				this.getredEnvelope();
			},

			onReachBottom: function() {
				this.pageNo++; //每触底一次 page +1
				// console.log(_self.hotRecommendlist.length);
				if (_self.loadingType != 0) { //loadingType!=0;直接返回
					return false;
				}
				_self.loadingType = 1;
				// console.log(page);
				uni.showNavigationBarLoading(); //显示加载动画
				let data = {
					pageNo: this.pageNo,
					pageSize: this.pageSize
				}
				api.myHelp.redEnvelopeDetailed(data).then(res => {
					if (res.code == 1) {
						if (this.redEvlopelist.length == res.data.data.totalcount) { //没有数据
							this.loadingType = 2;
							uni.hideNavigationBarLoading(); //关闭加载动画
							return false;
						}
						for (var i = this.redEvlopelist.length; i < res.data.data.totalcount; i++) {
							this.redEvlopelist = this.redEvlopelist.concat(res.data.data.response[i - 1]); //将数据拼接在一起
						}
						this.loadingType = 0; //将loadingType归0重置
						uni.hideNavigationBarLoading(); //关闭加载动画
					}
				})
			},
			// 获取红包明细
			getredEnvelope() {
				_self.loadingType = 0;
				uni.showNavigationBarLoading();
				let data = {
					pageNo: this.pageNo,
					pageSize: this.pageSize
				}
				api.myHelp.redEnvelopeDetailed(data).then(res => {
					if (res.code == 1) {
						this.redEvlopelist = res.data;
						if (res.data.data.totalcount == res.data.data.response.length) {
							uni.showToast({
								title: '已是最新',
								duration: 2000
							});
						}
						uni.hideNavigationBarLoading(); //关闭加载动画
						uni.stopPullDownRefresh(); //得到数据后停止下拉刷新
					}
				})
			},

		}
	}
</script>

<style>
	@import url("./redEnvelopeManagement.css");

	.loading-text {
		color: #999999;
		font-size: 30rpx;
		display: flex;
		justify-content: center;
		height: 40rpx;
	    align-items: center;
	}
</style>
